<template>
  <div>
    <el-card>
      <!-- 添加或删除组件 -->
      <Forms ref="refForms" :dialog="dialog" :cateListData="cateListData" @refreshList="refreshList"></Forms>
      <!-- 展示数据列表组件 -->
      <Lists :dialog="dialog" :cateListData="cateListData" @editCategory="editCategory" :refreshList="refreshList"></Lists>
    </el-card>
  </div>
</template>

<script>
import Forms from "./component/Forms.vue";
import Lists from "./component/Lists.vue";
import {mapActions,mapGetters} from 'vuex'
export default {
  components: { Forms, Lists },
  data() {
    return {
      dialog: {
        isShowDialog: false,
      },
      
    };
  },
  computed: {
    // 导出数据
    ...mapGetters({cateListData:"Category/cateListData"})
  },
  methods: {
    // 获取商品分类列表数据
    ...mapActions({getCateListData:"Category/getCateListData"}),
    // 刷新数据列表
    refreshList(){
        this.getCateListData()
    },
    // 点击编辑展示编辑信息
    editCategory(id){
        this.$refs.refForms.getOneCategoryData(id)
    }
  },
  mounted() {
    this.getCateListData();
  },
};
</script>

<style>
</style>